<template>
	<view class="PersonAccount padding16">
		<view class="account radius12 f-background text-align margin-bottom-16">
			<image class="account-img" src="@/static/icon/qd.png" mode=""></image>
			<view class="withdrawable font-weight-400 color3 size-32">可提现(元)</view>
			<view class="font-weight-600 color3 size-64 price-font"><text class="size-34">¥</text>156.99</view>
			<u-button type="primary" :hoverStartTime="100000"
				:customStyle="{width: '334rpx',height: '84rpx',margin: '36rpx auto', borderRadius: '8rpx'}"
				color="#FF1E1E">
				<text class="color-f font-weight-400 size-32">提现</text>
			</u-button>
			<view class="dis font-weight-400 color3 size-28">
				<view>待结算：<text class="price-font">¥555</text></view>
				<view class="settlement">
					已提现：<text v-if="!hide">*****</text>
					<text v-else class="price-font">￥5555</text>
					<text class="iconfont color9 size-24" :class="hide? 'icon-yanjing1':'icon-yanjing'"
						@click="hide = hide?false:true"></text>
				</view>
			</view>
			<view class="statement font-weight-400 color9 size-24">结算说明：当日送达的订单服务费次日结算到可提现账户</view>
		</view>
		<navigator url="/packagePerson/account/detailed?type=2" hover-class="none" class="details margin-bottom-16 f-background radius12 dis-cen">
			<text class="font-weight-600 color3 size-30">资金明细</text>
			<text class="margin-left-12 iconfont icon-right-1-copy color9 size-30"></text>
		</navigator>
		<navigator url="/packagePerson/account/detailed?type=1" hover-class="none" class="details margin-bottom-16 f-background radius12 dis-cen">
			<text class="font-weight-600 color3 size-30">提现记录</text>
			<text class="margin-left-12 iconfont icon-right-1-copy color9 size-30"></text>
		</navigator>
	</view>
</template>

<script>
	export default {
		name: "PersonAccount",
		data() {
			return {
				hide: true
			}
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.PersonAccount {
		.details {
			padding: 38rpx 28rpx 36rpx;
		}

		.account {
			padding: 52rpx 0 40rpx;

			.statement {
				margin-top: 28rpx;
			}

			.withdrawable {
				margin-bottom: 20rpx;
			}

			.account-img {
				width: 76rpx;
				height: 76rpx;
				margin: 0 auto 52rpx;
			}

			.settlement {
				margin-left: 68rpx;

				.icon-yanjing1,
				.icon-yanjing {
					margin-left: 36rpx;
				}
			}
		}

	}
</style>